<template>
  <div>
    <!-- 常规编辑区域 -->
    <el-form :model="form" ref="form" :rules="rules" label-width="80px">
      <el-row>
        <el-col :span="12">
          <el-form-item label="工号" prop="staffNo">
            <el-select v-model="form.staffNo" value-key="employeeId" placeholder="支持工号搜索" filterable remote size="small" style="width: 100%;"
                       :remote-method="getEmployee" @change="getEmployeeInfo">
              <el-option
                      v-for="(row,index) in employeeListOptions"
                      :key="index"
                      :label="row.employeeId"
                      :value="row"
              />
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="姓名" prop="name">
            <el-input v-model="form.name" :disabled="true" placeholder="请输入姓名"/>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="部门" prop="userDeptName">
            <el-input v-model="form.userDeptName" :disabled="true" placeholder="请输入考生部门"/>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="题库" prop="questionBankName">
            <el-select v-model="form.questionBankName" placeholder="请选择题库" filterable size="small" style="width: 100%;"
                       @change="bindQuestionBankData">
              <el-option
                      v-for="(q,index) in questionBankListOptions"
                      :key="index"
                      :label="q.questionBankName"
                      :value="q.questionBankName"
              />
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="项目代码" prop="projectCode">
            <el-input v-model="form.projectCode" size="small" :disabled="true"/>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="项目名称" prop="projectName">
            <el-input v-model="form.projectName" size="small" :disabled="true"/>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item ref="status" label="取证状态" prop="obtainEvidenceStatus">
            <el-select v-model="form.obtainEvidenceStatus" placeholder="请选择取证状态" size="small" style="width: 100%;">
              <el-option
                      v-for="dict in obtainEvidenceStatusOptions"
                      :key="dict.code"
                      :label="dict.name"
                      :value="dict.code"
              />
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="是否补考">
            <el-radio-group v-model="form.isSignUp">
              <el-radio :label="'0'">是</el-radio>
              <el-radio :label="'1'">否</el-radio>
            </el-radio-group>
          </el-form-item>
        </el-col>
      </el-row>
      <div v-if="openSkillAppraisal">
        <el-row>
          <el-col :span="12">
            <el-form-item label="身份证号" prop="idCard">
              <el-input v-model="form.idCard" size="small"/>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="上机等级" prop="levelOfOperation">
              <el-input v-model="form.levelOfOperation" size="small"/>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="专业组" prop="professionalGroup">
              <el-input v-model="form.professionalGroup" size="small"/>
            </el-form-item>
          </el-col>
        </el-row>
      </div>

    </el-form>
    <div slot="footer" class="dialog-footer" style="float: right;">
      <el-button :loading="buttonLoading" size="mini" type="primary" @click="submitForm">保 存</el-button>
      <el-button :loading="buttonLoading" size="mini" @click="cancel">取 消</el-button>
    </div>
  </div>
</template>

<script>
  import {addSignUp, getSignUpDept, updateSignUp} from "@/api/exam/signUp"
  import {getQuestionBankList} from "@/api/question/questionBank";
  import {getEmployee} from "@/api/basicdata/employee";

  export default {
    name: "signUp",
    components: {
      // Treeselect
    },
    data() {
      return {
        //遮罩层
        buttonLoading: false,
        //取证状态
        obtainEvidenceStatusOptions: [],
        //题库列表项
        questionBankListOptions: [],
        // 人员信息
        employeeListOptions: [],
        // 技能鉴定开关
        openSkillAppraisal: false,
        form: {
          // 是否补考
          isSignUp: '1',
          name: undefined, // 考生姓名
          userDeptName: undefined, // 考生部门
        },
        rules: {
          staffNo: [
            {required: true, message: "工号不能为空", trigger: "blur"}
          ],
          name: [
            {required: true, message: "姓名不能为空", trigger: "blur"}
          ],
          questionBankName: [
            {required: true, message: "题库不能为空", trigger: "change"}
          ],
          obtainEvidenceStatus: [
            {required: true, message: "取证状态不能为空", trigger: "change"}
          ],
          idCard: [
            {required: true, message: "身份证号不能为空", trigger: "change"}
          ],
          levelOfOperation: [
            {required: true, message: "上机等级不能为空", trigger: "change"}
          ],
          professionalGroup: [
            {required: true, message: "专业组不能为空", trigger: "change"}
          ]
        }
      }
    },
    created() {
      //取证状态
      this.getDicts("exam_obtain_evidence_status").then(response => {
        this.obtainEvidenceStatusOptions = response.responseBody.result;
      })
      //题库信息
      getQuestionBankList({
        'pageParameter': {"page":1,"rows":1000},
        'searchParams': {}
      }).then(response => {
        this.questionBankListOptions = response.responseBody.result;
      })
    },
    methods: {
      //绑定题库数据
      bindQuestionBankData(val) {
        // 技能鉴定标志
        let flag = false
        for (let i = 0; i < this.questionBankListOptions.length; i++) {
          if (this.questionBankListOptions[i].questionBankName == val) {
            this.form.questionBankId = this.questionBankListOptions[i].questionBankId;
            this.form.projectCode = this.questionBankListOptions[i].projectCode;
            this.form.projectName = this.questionBankListOptions[i].projectName;
            this.form.questionBankType = this.questionBankListOptions[i].questionBankType
            flag = this.questionBankListOptions[i].questionBankType === '1' ? true : false // 1：技能鉴定
            // 如果是不是技能鉴定，需要清除技能鉴定信息项
            if(!flag){
              this.form.idCard = undefined
              this.form.levelOfOperation = undefined
              this.form.professionalGroup = undefined
            }
            break
          }
        }
        this.openSkillAppraisal = flag
      },
      //绑定日期
      bindDate() {
        let year = new Date().getFullYear();
        let month = new Date().getMonth() + 1;
        let day = new Date().getDate();
        this.form.cancelDate = year + "-" + month + "-" + day;
      },
      //关闭dialog
      cancel() {
        this.$emit("cancelDialog");
      },
      // 通过工号
      getEmployee(employeeId) {
        getEmployee({
          'pageParameter': {page: 1, rows: 50},
          'searchParams': {employeeId:employeeId},
          'keyWord': 'true'
        }).then(res => {
          this.employeeListOptions = res.responseBody;
        })
      },
      // 获取考试人员信息
      getEmployeeInfo(row) {
        // 绑定考生信息
        this.form.staffNo = row.employeeId;
        // 获取考生所属大部门和报名人员所属部门
        getSignUpDept(row.employeeId).then(res => {
          this.form.name = row.employeeName;
          this.form.userDeptName = res.responseBody.userDeptName;
          this.form.userOrgCode = res.responseBody.userOrgCode;
          // 绑定报名人员所属部门信息
          this.form.signUpDeptName = res.responseBody.signUpDeptName;
          this.form.signUpOrgCode = res.responseBody.signUpOrgCode;
          console.log("报名考生信息："+JSON.stringify(this.form));
        }).catch(err => {});
      },

      //新增
      submitForm() {
        this.$refs["form"].validate(valid => {
          if (valid) {
            this.buttonLoading = true;
            // 如果是技能鉴定需要验证身份证号
            if(this.form.questionBankType === '1'){
              if(/(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/.test(this.form.idCard) === false){
                this.msgError('身份证号非法')
                this.buttonLoading = false
                return
              }
            }
            if (this.form.signUpId != undefined) {
              updateSignUp(this.form).then(response => {
                if (response.retCode === '200') {
                  this.msgSuccess(response.message);
                }
                // this.msgSuccess("修改成功");
                this.$emit("submitForm");
                this.cancel();
              }).finally(() => {
                this.buttonLoading = false;
              });
            } else {
              addSignUp(this.form).then(response => {
                if (response.retCode === '200') {
                  this.msgSuccess(response.message);
                }
                // this.msgSuccess("新增成功");
                this.$emit("submitForm");
                this.cancel();
              }).finally(() => {
                this.buttonLoading = false;
              });
            }
          }
        });
      },
    }
  }
</script>
